import 'package:card_swiper/card_swiper.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:sz/components/sz-tab.dart';
import 'package:sz/pages/tabbar/zhipin/components/recruit_list_one.dart';
import 'package:sz/pages/tabbar/zhipin/zhipin_serve.dart';
import 'package:sz/tools/tools.dart';

// 智聘
class ZhipinPage extends StatefulWidget {
  const ZhipinPage({
    Key? key,
  }) : super(key: key);

  @override
  ZhipinPageState createState() => ZhipinPageState();
}

class ZhipinPageState extends State<ZhipinPage> {
  ZhipinServe zhipinServe = ZhipinServe();

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: SzColor.f4f4f4,
      body: ListView(
        children: [
          //第一部分
          builderOne(),
          //第二部分
          builderTwo(),
          // 大学生就业区
          buildUniversity(),
          // 热门招聘
          buildPopular(),
          const Column(
            children: [RecruitListOne(), RecruitListOne(), RecruitListOne()],
          )
        ],
      ),
    );
  }

  ///热门招聘
  Column buildPopular() {
    return Column(
      children: [
        Container(
          width: getScreenWidth,
          height: rpx(80),
          margin: EdgeInsets.only(top: rpx(20)),
          child: Obx(
            () => SzTab(
              values: zhipinServe.typeListOne,
              current: zhipinServe.typeListOneCurrent.value,
              clickItem: (e) {
                zhipinServe.typeListOneCurrent.value = e;
              },
            ),
          ),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Container(
              width: rpx(560),
              height: rpx(80),
              margin: EdgeInsets.only(top: rpx(20), left: rpx(24)),
              child: Obx(
                () => SzTab(
                  values: zhipinServe.typeListOne,
                  current: zhipinServe.typeListOneCurrent.value,
                  bottomBorder: false,
                  clickItem: (e) {
                    zhipinServe.typeListOneCurrent.value = e;
                  },
                ),
              ),
            ),
            Container(
              padding: EdgeInsets.only(right: rpx(24), top: rpx(13)),
              height: rpx(80),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    '查看更多',
                    style: TextStyle(
                      color: const Color(0xff94a0c1),
                      fontSize: rpx(26),
                    ),
                  ),
                  Icon(
                    AliIcon.qingxuanzeyoujiantou,
                    color: const Color(0xff94a0c1),
                    size: setSp(22),
                  )
                ],
              ),
            )
          ],
        )
      ],
    );
  }

  /// 大学生就业区
  Container buildUniversity() {
    return Container(
      width: getScreenWidth,
      margin: EdgeInsets.only(
        left: rpx(24),
        right: rpx(24),
        top: rpx(24),
      ),
      decoration: BoxDecoration(
          gradient: const LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [
              Color(0xffFFF3DE),
              Color(0xffFFFFFF),
              Color(0xffFFFFFF),
            ],
          ),
          borderRadius: BorderRadius.all(Radius.circular(rpx(20)))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Padding(
            padding: EdgeInsets.only(left: rpx(20)),
            child: Image.asset(
              'images/imgs/zhipin/unEmployment.png',
              height: rpx(100),
              width: rpx(300),
            ),
          ),
          Center(
            child: Wrap(
              spacing: rpx(26),
              runSpacing: rpx(20),
              children: zhipinServe.unTagList
                  .map(
                    (e) => InkWell(
                      onTap: () {
                        if (e['path'].length > 0) Get.toNamed(e['path']);
                      },
                      child: Stack(
                        children: [
                          Container(
                            width: rpx(315),
                            height: rpx(180),
                            decoration: BoxDecoration(
                              color: Color(e['bg']),
                              borderRadius: BorderRadius.circular(
                                rpx(10),
                              ),
                            ),
                          ),
                          Positioned(
                            top: rpx(20),
                            right: rpx(0),
                            child: Image.asset(
                              e['bgImg'],
                              width: rpx(300),
                            ),
                          ),
                          Positioned(
                            left: rpx(20),
                            top: rpx(30),
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.start,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Text(
                                  e['title'],
                                  style: const TextStyle(
                                      fontWeight: FontWeight.bold),
                                ),
                                SizedBox(
                                  height: rpx(10),
                                ),
                                SizedBox(
                                  width: rpx(180),
                                  child: Text(
                                    e['content'],
                                    style: TextStyle(fontSize: setSp(26)),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                  )
                  .toList(),
            ),
          ),
        ],
      ),
    );
  }

  ///第二部分
  Widget builderTwo() {
    return Column(
      children: [
        // 一
        Container(
          width: getScreenWidth,
          height: rpx(80),
          padding: EdgeInsets.symmetric(horizontal: rpx(24)),
          margin: EdgeInsets.only(top: rpx(20)),
          child: Obx(
            () => SzTab(
              values: zhipinServe.tabList,
              current: zhipinServe.tabcurrent.value,
              clickItem: (e) {
                zhipinServe.tabcurrent.value = e;
              },
            ),
          ),
        ),
        // 二
        Padding(
          padding: EdgeInsets.only(top: rpx(24)),
          child: Wrap(
            spacing: rpx(24),
            runSpacing: rpx(24),
            children: zhipinServe.tabData
                .map(
                  (e) => ClipRRect(
                    borderRadius: BorderRadius.circular(rpx(10)),
                    child: Image.network(
                      e['logoUrl'],
                      fit: BoxFit.cover,
                      width: rpx(154.5),
                      height: rpx(154.5),
                    ),
                  ),
                )
                .toList(),
          ),
        ),
      ],
    );
  }

  ///第一部分
  SizedBox builderOne() {
    return SizedBox(
      width: getScreenWidth,
      height: rpx(380),
      child: Stack(
        children: [
          Swiper(
            itemWidth: rpx(702),
            itemHeight: rpx(380),
            pagination: SwiperPagination(
              margin: EdgeInsets.all(rpx(10)),
            ),
            itemCount: zhipinServe.bannerList.length,
            loop: true,
            autoplay: true,
            itemBuilder: (BuildContext context, int index) {
              return Image.network(
                zhipinServe.bannerList[index]['imgUrl'],
                fit: BoxFit.fill,
              );
            },
            onTap: (int index) {
              FPrint('banner $index');
            },
          ),
          Positioned(
            right: rpx(30),
            top: rpx(30),
            child: InkWell(
              onTap: () {},
              child: Icon(
                const IconData(
                  0xe60a,
                  fontFamily: 'AliIcon',
                ),
                color: Colors.white,
                size: setSp(45),
              ),
            ),
          ),
        ],
      ),
    );
  }
}
